<template>
  <div>
    <a-descriptions :column="2" style="padding: 0 40px">
      <a-descriptions-item label="姓名">
        {{ descriptions.realName }}
      </a-descriptions-item>
      <a-descriptions-item label="身份证号">
        {{ descriptions.identityCard }}
      </a-descriptions-item>
      <a-descriptions-item label="戒毒所名称">
        {{ descriptions.durgRehabilitatioName }}
      </a-descriptions-item>
      <a-descriptions-item label="戒毒截止日期">
        {{ descriptions.enterEndTime }}
      </a-descriptions-item>
    </a-descriptions>
    <a-form-model
      ref="ruleForm"
      :model="form"
      :rules="rules"
      :label-col="labelCol"
      :wrapper-col="wrapperCol"
    >
      <a-form-model-item label="出所原因" prop="reasonGoOut">
        <j-dict-select-tag
          :disabled="disabled"
          v-model="form.reasonGoOut"
          dictCode="ChuSuoY"
          placeholder="请选择出所原因"
          style="min-width: 100px"
        />
      </a-form-model-item>
      <a-form-model-item label="通知单位" prop="notifiyUnit">
        <j-select-depart :disabled="disabled" v-model="form.notifiyUnit" :orgCode="orgCode" :trigger-change="true" customReturnField="orgCode" :multi="true"></j-select-depart>
      </a-form-model-item>
      <a-form-model-item label="出所详细地址" prop="exitAddressDetail">
        <a-input
          :disabled="disabled"
          v-model="form.exitAddressDetail"
          placeholder="请输入出所详细地址"
        />
      </a-form-model-item>
      <a-form-model-item label="监所联系方式" prop="contactInformation">
        <a-input
          :disabled="disabled"
          v-model="form.contactInformation"
          placeholder="请输入监所联系方式"
        />
      </a-form-model-item>
      <a-form-model-item label="通知内容" prop="contentCaution">
        <a-input v-model="form.contentCaution" type="textarea" :disabled="disabled"/>
      </a-form-model-item>
      <a-form-model-item label="出所材料">
        <a-input
          v-model="form.cailiao"
          :disabled="true"
        >
          <template slot="suffix">
            <a href="">预览</a><a-divider type="vertical"/><a href="">下载</a>
          </template>
        </a-input>
      </a-form-model-item>
      <a-form-model-item label="上传出所材料" prop="exitMaterId">
        <span style="position: relative">
            <j-upload
              :disabled="disabled"
              v-model="form.exitMaterId"
            />
            <span>仅支持扩展名为pdf 的文档</span>
            <span style="position: absolute; left: 124px; top: 0">
              <a-tooltip placement="topLeft" title="请将出所材料下载签字盖章后上传">
                <a-icon type="question-circle"/>
              </a-tooltip>
            </span>
          </span><br/>

      </a-form-model-item>
      <a-form-model-item :wrapper-col="{ span: 14, offset: 4 }" v-if="buttonTF">
        <a-button @click="runtenFun">
          返回
        </a-button>
        <a-button style="margin-left: 10px;" type="primary" @click="onSubmit">
          确认通知
        </a-button>
        <a-button style="margin-left: 10px;" @click="localStorageFun">
          保存并退出
        </a-button>
      </a-form-model-item>
    </a-form-model>
  </div>
</template>

<script>
/*
通知
 */
import Vue from "vue";
import {USER_INFO} from "@/store/mutation-types";
import {notifyUnit, queryUnit} from "@api/sjsk/receiveCase";

export default {
  name: "notice",
  props:['current'],
  data(){
    return {
      descriptions:this.$route.query,
      form:{},
      buttonTF:true,
      disabled:false,
      labelCol: { span: 2 },
      wrapperCol: { span: 8 },
      rules:{
        reasonGoOut:[{ required: true, message: '请选择出所原因', trigger: 'change' }],
        notifiyUnit:[{ required: true, message: '请选择通知单位', trigger: 'change' }],
        exitAddressDetail:[{ required: true, message: '请输入出所详细地址', trigger: 'blur' }],
        contactInformation:[{ required: true, message: '请输入监所联系方式', trigger: 'blur' }],
        contentCaution:[{ required: true, message: '请输入通知内容', trigger: 'blur' }],
        exitMaterId:[{ required: true, message: '请上传出所材料', trigger: 'blur' }],
      },
      orgCode:''
    }
  },
  created() {
    this.orgCode = Vue.ls.get(USER_INFO).orgCode
    console.log(this.orgCode)
    console.log(this.$route.query)

  },
  mounted() {
    this.form.id = this.$route.query.id
    console.log(this.$route.query)
    this.queryFun(this.$route.query.personId)
    this.buttonTF = this.current === 0
    // console.log(this.$store.state.holographicArchives.currentStage)
    this.disabled = !this.buttonTF
    // if(localStorage.getItem('noticeeForm')){
    //   this.form = JSON.parse(localStorage.getItem('noticeeForm'))
    // }
  },
  methods:{
    //查询
    queryFun(val){
      queryUnit({id:val}).then(ser => {
        if(ser.success && ser.result){
          this.form = ser.result
        }
      }).catch(err => {
        console.log(err)
      })
    },
    //返回
    runtenFun(){
      this.$router.go (-1)
    },
    //提交
    onSubmit() {
      this.form = Object.assign(this.form,{id:this.$route.query.id},{personId:this.$route.query.personId})
      this.$refs.ruleForm.validate(valid => {
        if (valid) {
          notifyUnit(this.form).then(ser => {
            if(ser.success){
              this.disabled = true
              this.buttonTF = false
              this.$emit('currentFu',1)
              // this.$route.query.currentStage = 1
              // this.$store.dispatch('currentStage',1)
              this.$message.success('通知成功')
            }
          })
        } else {
          this.$message.warn('请检查你的数据')
          return false;
        }
      });
    },

    //半永久存储
    localStorageFun(){
      this.$refs.ruleForm.validate(valid => {
        if (valid) {
          //本地永久存储
          localStorage.setItem('noticeeForm',JSON.stringify(this.form))
        } else {
          this.$message.warn('请检查你的数据')
          return false;
        }
      });

    }
  }
}
</script>

<style scoped>

</style>